<template>
  <el-dialog :title="title" v-model="show">
    <!-- 立即上架 -->
    <template v-if="type === 'productup'">
      <p>商品编号：{{productid}}&nbsp;&nbsp;商品名称：{{name}}</p>
      <p>上架后商品会在铂物馆进行展示和售卖，确认是否上架？</p>
      <div slot="footer" class="dialog-footer">
        <el-button @click="show = false">取 消</el-button>
        <el-button type="primary" @click="productUpSubmit">确 定</el-button>
      </div>
    </template>
    <!-- 立即下架 -->
    <template v-if="type === 'productdown'">
      <p>商品编号：{{productid}}&nbsp;&nbsp;商品名称：{{name}}</p>
      <p>下架后商品将不能在铂物馆进行展示和售卖，确认是否下架？</p>
      <div slot="footer" class="dialog-footer">
        <el-button @click="show = false">取 消</el-button>
        <el-button type="primary" @click="productDownSubmit">确 定</el-button>
      </div>
    </template>
    <!-- 定时上架 -->
    <template v-if="type === 'productTimingUp'">
      <p>商品编号：{{productid}}&nbsp;&nbsp;商品名称：{{name}}</p>
      <p>设定上架时间：
        <el-date-picker
          v-model="timeOfProductUp"
          type="datetime"
          placeholder="选择日期时间">
        </el-date-picker>
    </p>
      <p>设定开售时间：
        <el-date-picker
          v-model="timeOfProductSell"
          type="datetime"
          placeholder="选择日期时间">
        </el-date-picker>
      </p>
      <div slot="footer" class="dialog-footer">
        <el-button @click="show = false">取 消</el-button>
        <el-button type="primary" @click="productTimingUpSubmit">确 定</el-button>
      </div>
    </template>
    <!-- 定时下架 -->
    <template v-if="type === 'productTimingDown'">
      <p>商品编号：{{productid}}&nbsp;&nbsp;商品名称：{{name}}</p>
      <p>设定下架时间：
        <el-date-picker
          v-model="timeOfProductDown"
          type="datetime"
          placeholder="选择日期时间">
        </el-date-picker>
      </p>
      <div slot="footer" class="dialog-footer">
        <el-button @click="show = false">取 消</el-button>
        <el-button type="primary" @click="productTimingDownSubmit">确 定</el-button>
      </div>
    </template>
    <!-- 商品删除 -->
    <template v-if="type === 'productDelete'">
      <p>商品编号：{{productid}}&nbsp;&nbsp;商品名称：{{name}}</p>
      <p>删除商品？</p>
      <div slot="footer" class="dialog-footer">
        <el-button @click="show = false">取 消</el-button>
        <el-button type="primary" @click="productDeleteSubmit">确 定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script>
  import {
    SetProductUp,
    SetProductDown,
    SetProductTimingDown,
    SetProductTimingUp,
    SetProductDelete
  } from 'api'
  export default {
    data () {
      return {
        productid: null,
        timeOfProductUp: null,
        timeOfProductSell: null,
        timeOfProductDown: null,
        name: null,
        show: false,
        success: function () {

        },
        error: function () {

        },
        type: ''
      }
    },
    watch: {
      'show': function () {
        this.timeOfProductUp = null
        this.timeOfProductSell = null
        this.timeOfProductDown = null
      }
    },
    methods: {
      // 商品上架
      productUpSubmit () {
        let loading = this.$loading({
          fullscreen: true
        })
        SetProductUp({
          productId: this.productid
        }).then((res) => {
          this.show = false
          loading.close()
          if (res.data.code !== 100) {
            this.$message.error(res.data.message)
            this.error && this.error()
            return
          }
          this.$message.success('上架成功')
          this.success && this.success()
        })
      },
      // 商品定时上架
      productTimingUpSubmit () {
        if (!this.timeOfProductSell || !this.timeOfProductUp) {
          this.$alert('请输入时间')
          return false
        }
        let loading = this.$loading({
          fullscreen: true
        })
        SetProductTimingUp({
          sellTime: this.timeOfProductSell.getTime(),
          upTime: this.timeOfProductUp.getTime(),
          productId: this.productid
        }).then((res) => {
          this.show = false
          loading.close()
          if (res.data.code !== 100) {
            this.$message.error(res.data.message)
            this.error && this.error()
            return
          }
          this.$message.success('定时上架成功')
          this.success && this.success()
        })
      },
      // 商品下架
      productDownSubmit () {
        let loading = this.$loading({
          fullscreen: true
        })
        SetProductDown({
          productId: this.productid
        }).then((res) => {
          this.show = false
          loading.close()
          if (res.data.code !== 100) {
            this.$message.error(res.data.message)
            this.error && this.error()
            return
          }
          this.$message.success('下架成功')
          this.success && this.success()
        })
      },
      // 商品定时下架
      productTimingDownSubmit () {
        if (!this.timeOfProductDown) {
          this.$alert('请输入时间')
          return false
        }
        let loading = this.$loading({
          fullscreen: true
        })
        SetProductTimingDown({
          downTime: this.timeOfProductDown.getTime(),
          productId: this.productid
        }).then((res) => {
          this.show = false
          loading.close()
          if (res.data.code !== 100) {
            this.$message.error(res.data.message)
            this.error && this.error()
            return
          }
          this.$message.success('定时下架成功')
          this.success && this.success()
        })
      },
      // 商品删除
      productDeleteSubmit () {
        let loading = this.$loading({
          fullscreen: true
        })
        SetProductDelete({
          productId: this.productid
        }).then((res) => {
          this.show = false
          loading.close()
          if (res.data.code !== 100) {
            this.$message.error(res.data.message)
            this.error && this.error()
            return
          }
          this.$message.success('删除成功')
          this.success && this.success()
        })
      }
    },
    computed: {
      title () {
        let title = {
          'productup': '立即上架',
          'productdown': '立即下架',
          'productTimingUp': '定时上架设置',
          'productTimingDown': '定时下架设置',
          'productDelete': '删除商品'
        }
        let type = this.type
        return title[type]
      }
    }
  }
</script>
